<template>
  <v-p-r-layout>
    <el-card>
      <div slot="header">项目介绍</div>
      <el-form>
        <el-form-item label="项目名称">{{project.name}}</el-form-item>
        <el-form-item label="日志时间">{{report.created_at}}</el-form-item>
      </el-form>
    </el-card>

    <!--数据-->
    <report_platform_data :project="project" :platformTypes="platformTypes"/>

    <!--活跃主播-->
    <report_active_anchor :project="project" :date="report.created_at"/>

    <!--直播记录-->
    <report_schedules_data :project="project" :schedules="schedules"/>

  </v-p-r-layout>
</template>

<script>
  import Vue from 'vue';
  import ElementUI from 'element-ui';
  import 'element-ui/lib/theme-chalk/index.css';

  import Report_active_anchor from '../../component/component/report_active_anchor';
  import Report_platform_data from '../../component/component/report_platform_data';
  import Report_schedules_data from '../../component/component/report_schedules_data';

  Vue.use(ElementUI);
  export default {
    components: {
      Report_schedules_data,
      Report_platform_data,
      Report_active_anchor,
    },
    data() {
      return {
        selected: 0,
      };
    },
    computed: {
      project() {
        return this.data.project;
      },
      report() {
        return this.data.report;
      },
      platformTypes() {
        return this.data.platformTypes;
      },
      schedules() {
        return this.data.schedules;
      },
    },
    mounted() {
    },
  };
</script>

<style scoped>

  @media (max-width: 500px) {
    #app {
      margin: 0 10px;
    }

    .el-card {
      margin: 10px 0 0 0;
    }
  }

  @media (min-width: 600px) {
    #app {
      margin: 0 20px;
    }

    .el-card {
      margin: 20px 0 0 0;
    }
  }
</style>